<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>异步加载表头</title>
<script type="text/javascript" src="../../../jquery.js"></script>
    <script src="../../../ui/om-core.js"></script>
    <script src="../../../ui/om-validate.js"></script>
    <script src="../../../ui/om-mouse.js"></script>
    <script src="../../../ui/om-draggable.js"></script>
    <script src="../../../ui/om-position.js"></script>
    <script src="../../../ui/om-resizable.js"></script>
    <script type="text/javascript" src="../../../ui/om-grid.js"></script>
    <script src="../../../ui/om-messagetip.js"></script>
    <link rel="stylesheet" type="text/css" href="../../../themes/default/om-all.css" />
    <link rel="stylesheet" href="../../../demos/common/css/demo.css">
    <!-- view_source_begin -->
    <script type="text/javascript">
        $(document).ready(function(){
        	var col,
        	lan =window.navigator.language;
        	//首先从服务器端获取表头数据，再初始化数据表
        	$.getJSON("griddata.do?method=coldata&language="+lan,function(data){
        		col = data;
        		$("#grid").omGrid({
            		dataSource: "griddata.do?method=fast",
            		 width : 686,
                     height : 332,
                     limit : 10,
                     colModel : data
            	});
        	});
        	
        });
    </script>
    <!-- view_source_end -->
</head>
<body>
<!-- view_source_begin -->
<table id="grid"></table>
<!-- view_source_end -->

    <div id="view-desc">
        <p>本示例演示了如何异步加载表格的表头数据。<br/>
        表头数据决定了表格中显示的数据，因此该示例可以应用于根据权限控制表格显示的数据。</p>
    </div>
</body>
<script type="text/javascript" src="../../../demos/common/js/themeloader.js"></script>
</html>